<template>
  <a-card :bordered="false" title="">
    <a-spin :spinning="myLoading">
      <div class="table-page-search-wrapper">
        <a-form layout="inline">
          <a-row :gutter="48">
            <a-col :md="8" :sm="24">
              <a-form-item label="学生姓名">
                <a-input v-model="queryParam.userName" placeholder="请输入学生姓名"/>
              </a-form-item>
            </a-col>
            <a-col :md="8" :sm="24">
              <span class="table-page-search-submitButtons">
                <a-button type="primary" @click="getData()">查询</a-button>
                <a-button style="margin-left: 8px" @click="() => {queryParam = {};getData()}">重置</a-button>
              </span>
            </a-col>
          </a-row>
        </a-form>
      </div>
      <div class="table-page-search-wrapper">
        <a-table
          class="components-table-demo-nested"
          ref="table" 
          :columns="columns" 
          :row-key="record => record.userId" 
          :data-source="data" 
          :pagination="pagination"
          @change="handleTableChange">
          <span slot="time" slot-scope="text, record">
            {{ dateFilter(record.time) }}
          </span>
        </a-table>
      </div>
    </a-spin>
  </a-card>
</template>

<script>
  import { getUrl,postAxiosUrl,uploadUrl } from '@/api/manage'
  import my from '@/api/my/my'
  export default {
    components: {
    },
    data() {
      return {
        defaultActiveKey : '',
        activeKey : '',
        columns: [
          {dataIndex:'userName',title: '姓名',},
          {dataIndex:'userScore',title: '得分',},
          {dataIndex:'company',title: '分配的单位',},
          {dataIndex:'time',title: '分配时间',scopedSlots: { customRender: 'time' }},
        ],
        data: [],
        pagination: {},
        myLoading: false,
        pagination: {size:'small'},
        queryParam:{},
      }
    },
    mounted() {
        this.getData()
    },
    computed: {

    },
    methods: {

      dateFilter(value){
        var date = new Date(value)
        var year = date.getFullYear() + '年'
          var month = date.getMonth()+1 + '月'
          var day = date.getDate() + '日 '
          var hour = (date.getHours() < 10 ?('0' + date.getHours()) : date.getHours())+ ':'
          var min = (date.getMinutes() < 10 ?('0' + date.getMinutes()) : date.getMinutes())+ ':'
          var sec = (date.getSeconds() < 10 ?('0' + date.getSeconds()) : date.getSeconds())
        var formatDate = year + month + day + hour +min +sec
        return formatDate
      },
      handleTableChange(pagination, filters, sorter) {
        console.log(pagination)
        const pager = { ...this.pagination
        }
        pager.current = pagination.current
        this.pagination = pager
        this.clearRowSelection()
        this.getData({
          results: pagination.pageSize,
          page: pagination.current,
          sortField: sorter.field,
          sortOrder: sorter.order,
          ...filters,
        })
      },
      getData(params = {}) {
          var _this = this
          _this.myLoading = true
           params['userName']=_this.queryParam.userName
          getUrl('graduationHistory/getAll', params)
            .then(res => {
               _this.myLoading = false
              _this.data = res.result.data
              
              const pagination = { ...this.pagination }
              // Read total count from server
              pagination.total = res.result.totalCount
              pagination.showTotal = total => `共 ${total} 条`
              pagination.showQuickJumper = true
              this.pagination = pagination

            })
        
      }
    }
  }
</script>
<style>

</style>